﻿// 标签页切换功能
document.addEventListener('DOMContentLoaded', function() {
    // 获取所有标签按钮和内容区域
    const tabButtons = document.querySelectorAll('.tab-button');
    const tabContents = document.querySelectorAll('.tab-content');
    
    // 为每个标签按钮添加点击事件
    tabButtons.forEach(button => {
        button.addEventListener('click', function() {
            // 移除所有按钮和内容的active类
            tabButtons.forEach(btn => btn.classList.remove('active'));
            tabContents.forEach(content => content.classList.remove('active'));
            
            // 为当前点击的按钮和对应的内容添加active类
            this.classList.add('active');
            const tabId = this.getAttribute('data-tab');
            document.getElementById(tabId).classList.add('active');
        });
    });
});

document.getElementById('formatJsonButton').addEventListener('click', () => {
    const inputJson = document.getElementById('inputJson').value;
    try {
        const parsedJson = JSON.parse(inputJson);
        const formattedJson = JSON.stringify(parsedJson, null, 2);
        document.getElementById('formattedJson').textContent = formattedJson;
        document.getElementById('originalJson').textContent = inputJson;
    } catch (e) {
        alert('无效的 JSON 数据');
    }
});

document.getElementById('compareButton').addEventListener('click', () => {
    const originalJson = document.getElementById('originalJson').textContent;
    const formattedJson = document.getElementById('formattedJson').textContent;
    if (originalJson.trim() === formattedJson.trim()) {
        alert('原始 JSON 和格式化后的 JSON 相同');
    } else {
        alert('原始 JSON 和格式化后的 JSON 不同');
    }
});

// Base64编码/解码功能
document.getElementById('encodeBase64Button').addEventListener('click', () => {
    const input = document.getElementById('inputBase64').value;
    const encoded = btoa(unescape(encodeURIComponent(input)));
    document.getElementById('base64Result').textContent = encoded;
});

document.getElementById('decodeBase64Button').addEventListener('click', () => {
    const input = document.getElementById('inputBase64').value;
    try {
        const decoded = decodeURIComponent(escape(atob(input)));
        document.getElementById('base64Result').textContent = decoded;
    } catch (e) {
        alert('无效的Base64数据');
    }
});

// URL编码/解码功能
document.getElementById('encodeUrlButton').addEventListener('click', () => {
    const input = document.getElementById('inputUrl').value;
    const encoded = encodeURIComponent(input);
    document.getElementById('urlResult').textContent = encoded;
});

document.getElementById('decodeUrlButton').addEventListener('click', () => {
    const input = document.getElementById('inputUrl').value;
    try {
        const decoded = decodeURIComponent(input);
        document.getElementById('urlResult').textContent = decoded;
    } catch (e) {
        alert('无效的URL编码数据');
    }
});

// HTML实体编码/解码功能
document.getElementById('encodeHtmlButton').addEventListener('click', () => {
    const input = document.getElementById('inputHtml').value;
    const encoded = input.replace(/[&<>'"]/g, 
        tag => ({
            '&': '&amp;',
            '<': '&lt;',
            '>': '&gt;',
            "'": '&#39;',
            '"': '&quot;'
        }[tag]));
    document.getElementById('htmlResult').textContent = encoded;
});

document.getElementById('decodeHtmlButton').addEventListener('click', () => {
    const input = document.getElementById('inputHtml').value;
    const decoded = input.replace(/&amp;|&lt;|&gt;|&#39;|&quot;/g, 
        tag => ({
            '&amp;': '&',
            '&lt;': '<',
            '&gt;': '>',
            '&#39;': "'",
            '&quot;': '"'
        }[tag]));
    document.getElementById('htmlResult').textContent = decoded;
});


// 为所有结果区域添加复制功能
function addCopyButtons() {
    // 为JSON结果添加复制按钮
    const jsonResults = document.querySelectorAll('#formattedJson, #originalJson');
    jsonResults.forEach(result => {
        if (!result.previousElementSibling || !result.previousElementSibling.classList.contains('copy-btn')) {
            const copyBtn = document.createElement('button');
            copyBtn.className = 'copy-btn';
            copyBtn.textContent = '复制';
            copyBtn.addEventListener('click', () => {
                navigator.clipboard.writeText(result.textContent)
                    .then(() => alert('已复制到剪贴板'))
                    .catch(err => alert('复制失败: ' + err));
            });
            result.parentNode.insertBefore(copyBtn, result);
        }
    });

    // 为其他结果区域添加复制按钮
    const otherResults = document.querySelectorAll('#base64Result, #urlResult, #htmlResult');
    otherResults.forEach(result => {
        if (!result.previousElementSibling || !result.previousElementSibling.classList.contains('copy-btn')) {
            const copyBtn = document.createElement('button');
            copyBtn.className = 'copy-btn';
            copyBtn.textContent = '复制';
            copyBtn.addEventListener('click', () => {
                navigator.clipboard.writeText(result.textContent)
                    .then(() => alert('已复制到剪贴板'))
                    .catch(err => alert('复制失败: ' + err));
            });
            result.parentNode.insertBefore(copyBtn, result);
        }
    });
}

// 在DOM加载完成后添加复制按钮
document.addEventListener('DOMContentLoaded', function() {
    // 获取所有标签按钮和内容区域
// 由于后续会重复声明 tabButtons 变量，为避免重复声明错误，这里将变量名改为 tabButtonsInitial
const tabButtonsInitial = document.querySelectorAll('.tab-button');
    const tabContents = document.querySelectorAll('.tab-content');
    
    // 为每个标签按钮添加点击事件
    tabButtons.forEach(button => {
        button.addEventListener('click', function() {
            // 移除所有按钮和内容的active类
            tabButtons.forEach(btn => btn.classList.remove('active'));
            tabContents.forEach(content => content.classList.remove('active'));
            
            // 为当前点击的按钮和对应的内容添加active类
            this.classList.add('active');
            const tabId = this.getAttribute('data-tab');
            document.getElementById(tabId).classList.add('active');
        });
    });
    document.getElementById('getSiteInfo').addEventListener('click', () => {
        chrome.tabs.query({active: true, currentWindow: true}, (tabs) => {
            const tab = tabs[0];
            if (tab) {
                const info = {
                    url: tab.url,
                    title: tab.title,
                    favicon: tab.favIconUrl,
                    status: tab.status,
                    id: tab.id,
                    windowId: tab.windowId
                };
                document.getElementById('siteInfo').textContent = JSON.stringify(info, null, 2);
            } else {
                document.getElementById('siteInfo').textContent = '无法获取当前标签页信息';
            }
        });
    });
    
    // 添加复制按钮
    addCopyButtons();
    
    // 监听标签切换事件，在切换后重新添加复制按钮
    const tabButtons = document.querySelectorAll('.tab-button');
    tabButtons.forEach(button => {
        button.addEventListener('click', addCopyButtons);
    });
});
